<template>
  <div>
    <!-- <button @click="handleClick(100, $event)">click</button>
    <a @click.prevent="handleAncherClick">百度</a> -->
    <div @click="handleOuterClick">
      outer
      <div @click.stop="handleInnerClick">
        inner
      </div>
      <input type="text" @keyup.up="handleInput">
    </div>
  </div>
</template>

<script>
export default {
  methods: {
    handleClick(num, e) {
      console.log(1)
      this.handleClick2()
    },
    handleClick2() {
      console.log(2)
    },
    handleAncherClick(e) {
      window.open('https://www.baidu.com')
    },
    handleInnerClick(e) {
      // e.stopPropagation()
      console.log('inner')
    },
    handleOuterClick() {
      console.log('outer')
    },
    handleInput(e) {
      console.log(e.keyCode)
    }
  }
}
</script>

<style lang='stylus' scoped>

</style>